﻿<div class="tabbable">
    <ul class="nav nav-tabs">
        <li class="pull-right">
            <button data-bind="click:add" class="btn btn-sm btn-primary">添加</button>
        </li>
    </ul>
</div>

<table class="table table-bordered">
    <thead>
        <tr>
            <th style="text-align:center;width:280px;">名称</th>
            <th style="text-align:center;">商品属性</th>
            <th style="text-align:center;">商品参数</th>
            <th style="width:160px;text-align:center;">操作</th>
        </tr>
    </thead>
    <tbody data-bind="">
        <!--ko foreach:items-->
        <tr>
            <td data-bind="text:Name"></td>
            <td data-bind="text:DefineName"></td>
            <td data-bind="text:ArgumentName"></td>
            <td style="text-align:center;">
                <button class="btn btn-primary btn-minier"><i class="icon-cog"></i></button>
                <button data-bind="click:$parent.remove" data-dialog='type:"confirm",content:"你删除该记录吗？"' class="btn btn-danger btn-minier"><i class="icon-trash"></i></button>
            </td>
        </tr>
        <!--/ko-->
        <tr data-bind="visible:ko.unwrap(items).length==0">
            <td style="height:100px;text-align:center;padding-top:40px;" colspan="4">
                暂无商品参数
            </td>
        </tr>
    </tbody>
</table>

<form name="dlg_productGroup" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                    <span class="sr-only">Close</span>
                </button>
                <h4 class="modal-title">编辑</h4>
            </div>
            <div class="modal-body">
                <input data-bind="value:item.Id" type="hidden" />
                <div class="form-horizontal">
                    <div class="form-group">
                        <label class="control-label col-sm-2">名称</label>
                        <div class="col-sm-10">
                            <input data-bind="value:item.Name" class="form-control" autofocus placeholder="例如：苹果手机" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2">产品属性</label>
                        <div class="col-sm-10">
                            <select data-bind="options:productDefines,optionsText:'Name',optionsValue:'Id',value:item.ProductPropertyDefeineId,optionsAfterRender:on_defineChange,optionsCaption:'请选择产品属性'" class="form-control" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-sm-2">产品参数</label>
                        <div class="col-sm-10">
                            <select data-bind="options:productArguments,optionsText:'Name',optionsValue:'Id',value:item.ProductArgumentId,optionsAfterRender:on_argumentChange,optionsCaption:'请选择产品参数'" class="form-control" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer" style="margin-top:0;">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button data-bind="click:save" type="button" class="btn btn-primary">保存</button>
            </div>
        </div>
    </div>
</form>
